import { complieTemplate } from './complie'

const domNodePool = [];

export function createApp(options) {
  for (let option in options) {
    switch (option) {
      case 'components':
        initComponent(options[option])
        break;
      default:
        break;

    }
  }

  return {
    mount
  }
}

/**
 * 初始化组件
 * @param {*} component 
 */
function initComponent(components) {
  for (let component of components) {
    let [template, state] = component()
    // console.log(template, state)
    // 模板编译

    const node = complieTemplate(template, state)

    domNodePool.push(node)

    console.log(domNodePool)
  }
}

function mount(el) {
  const app = document.querySelector(el)
  const oFrag = document.createDocumentFragment()

  domNodePool.forEach(node =>{
    oFrag.appendChild(node)
  })

  console.log(oFrag)
  app.appendChild(oFrag)
}